<template>
  <!-- 基本信息 -->
  <div>
    <el-descriptions title="客户信息" :column="3" border>
      <!-- 企业名称 -->
      <el-descriptions-item
        label="企业名称"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!--社会信用代码  -->
      <el-descriptions-item
        label="社会信用代码"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 行业类型 -->
      <el-descriptions-item
        label="行业类型"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 企业成立时间 -->
      <el-descriptions-item
        label="企业成立时间"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 进出口许可证 -->
      <el-descriptions-item
        label="进出口许可证"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        span="3"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 注册资金币种 -->
      <el-descriptions-item
        label="注册资金币种"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 工商注册资金（元） -->
      <el-descriptions-item
        label="工商注册资金（元）"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 所有制 -->
      <el-descriptions-item
        label="所有制"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 实际经营地址 -->
      <el-descriptions-item
        label="实际经营地址"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        span="3"
        ><div style="display: flex">
          <div class="day">
            <span></span>
            <span></span>
            <span></span>
          </div>
          <div class="day2"><span></span></div>
        </div>
      </el-descriptions-item>
      <!-- 企业注册地址 -->
      <el-descriptions-item
        label="企业注册地址"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        span="3"
        ><div style="display: flex">
          <div class="day">
            <span></span>
            <span></span>
            <span></span>
          </div>
          <div class="day2"><span></span></div>
        </div>
      </el-descriptions-item>
      <!-- 员工人数 -->
      <el-descriptions-item
        label="员工人数"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 经营范围 -->
      <el-descriptions-item
        label="经营范围"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        span="3"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 是否上市公司 -->
      <el-descriptions-item
        label="是否上市公司"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!--是否执照有效  -->
      <el-descriptions-item
        label="是否执照有效"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 企业类型 -->
      <el-descriptions-item
        label="企业类型"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
    </el-descriptions>
    <p></p>
    <el-descriptions title="法定代表人信息" :column="3" border>
      <!-- 法定代表人姓名 -->
      <el-descriptions-item
        label="法定代表人姓名"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!--性别  -->
      <el-descriptions-item
        label="性别"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 证件类型 -->
      <el-descriptions-item
        label="证件类型"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 证件号码 -->
      <el-descriptions-item
        label="证件号码"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!--手机号码  -->
      <el-descriptions-item
        label="手机号码"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
      <!-- 电子邮件 -->
      <el-descriptions-item
        label="电子邮件"
        align="center"
        label-class-name="my-label"
        class-name="my-content"
        width="180px"
        ><span>{{}}</span></el-descriptions-item
      >
    </el-descriptions>
    <p style="font-weight: 700">借款需求</p>
    <el-table :data="tableData">
      <el-table-column prop="date" label="序号" />
      <el-table-column prop="name" label="企业联系人姓名" />
      <el-table-column prop="post" label="职务" />
      <el-table-column prop="contact" label="联系电话" />
      <el-table-column prop="E_mail" label="电子邮件" />
      <el-table-column prop="portraiture" label="传真"
        ><input type="text" /></el-table-column
      >>
      <el-table-column prop="address" label="通信地址">
        <input type="text" />
      </el-table-column>
      <el-table-column label="操作"> </el-table-column>
    </el-table>
    <div id="but">
      <el-button type="primary" class="btn" @click="tijiao()">提交</el-button>
      <el-button type="primary" class="btn" @click="baocun()">保存</el-button>
      <el-button type="primary" class="but" @click="fanhiu()">返回</el-button>
    </div>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
let fanhiu = () => {
  router.go(-1);
};
/* 提交 */
let tijiao = () => {
  ElNotification.success({ message: "提交成功!" });
};
/* 保存 */
let baocun = () => {
  ElNotification.success({ message: "保存成功!" });
};
var tableData = [
  {
    date: "1",
    name: "Tom",
    post: "",
    contact: "",
    E_mail: "",
    portraiture: "",
    address: "",
  },
  {
    date: 2,
    name: "Tom",
    post: "",
    contact: "",
    E_mail: "",
    portraiture: "",
    address: "",
  },
];
</script>

<style scoped>
.day {
  display: flex;
  justify-content: space-around;
  width: 500px;
}
.day span {
  border: 1px solid #000;
  width: 120px;
  height: 20px;
  display: block;
}
.day2 {
  border: 1px solid #000;
  width: 120px;
  height: 20px;
  margin-left: 150px;
}
.but {
  background: none;
  color: #4eabfe;
}
#but {
  margin-top: 20px;
  float: right;
}
.btn {
  /* background: #3985c8; */
  color: white;
  width: 100px;
}
input {
  border: none;
}
</style>